﻿<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8"/>
<style>

body{margin:0;padding:0;overflow:hidden}
div.mask-target{
	display:inline-block;
	border-radius:3px;
	border:1px solid #A4D3F2;
	width:30%;height:200px;
	float:left;
	margin:100px;
	*display:inline;
	zoom:1
}
body, h1, h2, h3, h4, h5, h6, hr, p, blockquote, dl, dt, dd, ul, ol, li, pre, form, fieldset, legend, button, input, textarea, th, td {
margin: 0;
padding: 0;
}
table {
border-collapse: collapse;
border-spacing: 0;
}
.popup {
    position: absolute;
    z-index: 50;
    border-collapse: collapse;
    visibility: hidden;
}
.popup td.corner {
    height: 15px;
    width: 19px;
}
.popup td#topleft {
    background-image: url(tmp/images/bubble-1.png);
}
.popup td.top {
    background-image: url(tmp/images/bubble-2.png);
}
.popup td#topright {
    background-image: url(tmp/images/bubble-3.png);
}
.popup td.left {
    background-image: url(tmp/images/bubble-4.png);
}
.popup td.right {
    background-image: url(tmp/images/bubble-5.png);
}
.popup td#bottomleft {
    background-image: url(tmp/images/bubble-6.png);
}
.popup td.bottom {
    background-image: url(tmp/images/bubble-7.png);
    text-align: center;
}
.popup td.bottom img {
    display: block;
    margin: 0 auto;
}
.popup td#bottomright {
    background-image: url(tmp/images/bubble-8.png);
}
.popup table.popup-contents {
    font-size: 12px;
    line-height: 1.2em;
    background-color: #fff;
    color: #666;
    font-family: "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif;
}
table.popup-contents th {
    text-align: right;
    text-transform: lowercase;
}
table.popup-contents td {
    text-align: left;
}
tr#release-notes th {
    text-align: left;
    text-indent: -9999px;
    height: 17px;
}
tr#release-notes td a {
    color: #333;
}
.ks-overlay {
        position:absolute;
        left:-9999px;
        top:-9999px;
    }
#pp-content{
	padding:10px
}

</style>
    <script src="../../../../kissy/build/kissy.js"></script>
<script>
    KISSY.config({
        packages:[
            {
                name:"gallery",
                tag:"20111220",
                path:"../../../",  // cdn上适当修改对应路径
                charset:"utf-8"
            }
        ]
    });

KISSY.use('gallery/spotlight/1.0/,overlay',function(S,Spotlight,overlay){
	S.ready(function(){
		var spot = new Spotlight({
				quene:[{node:S.DOM.query('#player')}]
				,anim:{
					duration:.1
				}
				,opacity:.7
				,zIndex:9000
				,toggleOnAnim:false
			});
		S.one('button').on('click',function(){
			spot.start();
			console.log('1')
		});
	})
})
</script>
</head>
<body>
<div id="player" class="player"  style="margin:0 auto;width:610px;height:498px;margin-top:30px ">
							<embed width="610" height="498" pluginspage="http://www.macromedia.com/go/getflashplayer" flashvars="ShowId=0&amp;Cp=0&amp;Tid=0&amp;VideoIDS=XMjM2MTg2OTcy&amp;isAutoPlay=true&amp;Version=/v1.0.0647&amp;winType=interior&amp;iku_num=2" allowscriptaccess="always" allowfullscreen="true" quality="high" bgcolor="#FFFFFF" name="movie_player" id="movie_player" src="http://static.youku.com/v1.0.0141/v/swf/qplayer.swf" type="application/x-shockwave-flash">
							<div class="ft">
								<button>关灯看电影</button>
							</div>
						</div>
</body>
</html>